<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
#parse("/WEB-INF/views_webapp/layout/css.html")
<style type="text/css">
body{
	background: #eee;
}
.itembox{
	padding: 10px;
	background: #fff;
	position: relative;
}
.good-img{
	width: 40px;
	height: 40px;
	background: #ccc;
}
.jflex{
	display: flex;
	display: -webkit-flex;
}
.vcenter{
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
}
.good-info{
	flex: 1;
	-webkit-flex: 1;
	padding-left: 10px;
	color: #000;
}
.good-fee{
	color:red;
}
.gray{
	color: #999;
}
.goodsline{
	padding: 10px 0 10px 0;
	position: relative;
}
.oldfee{
	color: #999 !important;
	text-decoration:line-through;
	font-size: 12px;
	text-align: right;
}
.countfee{
	padding: 10px 0 0 0;
	text-align: right;
}
.red{
	color:red !important;
}
.ordertitle{
	padding: 10px;
}
.order_lines{
	padding: 5px 0 5px 0;
	color: #555;
}
.order-lines-lable{
	flex: 1;
	-webkit-flex: 1;
	color: #999;
}
.paybtns{
	width:100%;
	height: auto;
	position: fixed;
	bottom: 0;
	left: 0;
	padding: 10px;
	background:#f5f5f5;
	z-index: 1000;
}
.paybtniner{
	display: block;
	width: auto;
	height:44px;
	background:#09BB07;
	line-height:44px;
	margin-bottom: 0;
	text-align: center;
	margin-bottom: 10px;
	border-radius: 4px;
	color: #fff;
}
.paybtniner.bgapay{
	background: #01A8F9;
}
.paybtniner:active{
	opacity: 0.8;
}
.paybtniner:last-child{
	margin-bottom: 0;
}
.paddingH{
	height: 13rem;
}
</style>
</head>
<body>

<div class="ordertitle">
	商品信息
</div>

<div class="itembox line-t line-b">
	<div class="jflex vcenter goodsline line-b">
		<div class="good-img"></div>
		<div class="good-info">
			产地直销陕西延安红富士苹果2500g
		</div>
		<div class="good-fee">
			<div><span class="gray">￥</span>60.00</div>
			<div class="oldfee"><span class="gray">￥</span>60.00</div>
		</div>
	</div>
	<div class="jflex vcenter goodsline line-b">
		<div class="good-img"></div>
		<div class="good-info">
			产地直销陕西延安红富士苹果2500g
		</div>
		<div class="good-fee">
			<div><span class="gray">￥</span>60.00</div>
			<div class="oldfee"><span class="gray">￥</span>60.00</div>
		</div>
	</div>
	<div class="jflex vcenter goodsline line-b">
		<div class="good-img"></div>
		<div class="good-info">
			产地直销陕西延安红富士苹果2500g
		</div>
		<div class="good-fee">
			<div><span class="gray">￥</span>60.00</div>
			<div class="oldfee"><span class="gray">￥</span>60.00</div>
		</div>
	</div>
	<div class="jflex vcenter goodsline line-b">
		<div class="good-img"></div>
		<div class="good-info">
			产地直销陕西延安红富士苹果2500g
		</div>
		<div class="good-fee">
			<div><span class="gray">￥</span>60.00</div>
			<div class="oldfee"><span class="gray">￥</span>60.00</div>
		</div>
	</div>
	
	<div class="countfee">
		共<span class="red">4</span>件商品，合计：￥<span class="red">340.00</span>
	</div>
</div>

<div class="ordertitle">
	订单信息
</div>

<div class="itembox line-t line-b">
	<div class="order_lines jflex">
		<div class="order-lines-lable">订单金额</div>
		<div>￥468.90</div>
	</div>
	<div class="order_lines jflex">
		<div class="order-lines-lable">优惠合计</div>
		<div>￥200.00</div>
	</div>
	<div class="order_lines jflex">
		<div class="order-lines-lable">实付金额</div>
		<div class="red">￥368.90</div>
	</div>
</div>
<div class="paddingH"></div>
<div class="paybtns">
	<a class="paybtniner bgapay">支付宝支付</a>
	<a class="paybtniner">微信支付</a>
</div>

#parse("/WEB-INF/views_webapp/layout/bottom.html")
</body>
</html>